import { debounce } from "@/utils";

export default {
  data() {
    return {
      $_sidebarElm: null,
      $_resizeHandler: null,
    };
  },
  created() {
    this.$nextTick(() => {
      this.initListener();
    });
  },
  beforeDestroy() {
    this.destroyListener();
  },
  deactivated() {
    this.destroyListener();
  },
  methods: {
    // 导航栏收事件
    $_sidebarResizeHandler(e) {
      if (e.propertyName === "width") {
        this.resize();
      }
    },
    initListener() {
      window.addEventListener("resize", this.resize);
      this.$_sidebarElm =
        document.getElementsByClassName("sidebar-container")[0];
      this.$_sidebarElm?.addEventListener(
        "transitionend",
        this.$_sidebarResizeHandler
      );
    },
    destroyListener() {
      if (!this.chart) {
        return;
      }
      this.chart.dispose();
      this.chart = null;
      window.removeEventListener("resize", this.resize);
      this.$_sidebarElm?.removeEventListener(
        "transitionend",
        this.$_sidebarResizeHandler
      );
    },
    resize() {
      this.chart.resize();
    },
  },
};
